@extends('PShop::layout')
@push('styles')
    <link href="{{asset(config('view.plugin').'/layui/css/layui.css')}}" rel="stylesheet">
    <style type="text/css">
        .am-border{border:1px solid #EEEEEE;}
        .am-accordion-basic .am-accordion-title:before{content: "";}
        .am-accordion-content .am-table{width: 25%;padding:0.5rem 0;}
        .am-accordion-content .am-table tr td:first-child{border-left: none;}
        .am-accordion-content .am-table-bordered{border-left: 1px solid #ddd;}
        .am-accordion-content .am-form-field{width: 26rem;}
        .am-checkbox, .am-radio, .am-checkbox-inline, .am-radio-inline{line-height: 1;}
        .paytype-list span{position: relative;}
        .paytype-list .am-active img{border:1px solid #FF0000;}
        .paytype-list .am-active em{position: absolute;bottom: 0;right: 0;width: 12px;height: 12px;}
        .pay-title{border-top-right-radius: 2rem;border-bottom-right-radius: 2rem;display: inline-block;}
    </style>
@endpush
@section('content')
    <section class="wapper">
        <div class="base-w">
            <div class="">
                <div class="am-g am-margin-bottom-sm am-padding">
                    <div class="am-u-md-8 am-u-lg-8 am-padding-right-0">
                        <h3>订单提交成功，请尽快付款！订单号：{{$order->order_sn}}</h3>
                        <div class="am-link-muted">请您在<em class="am-text-danger">24小时内</em>完成支付，否则订单会被自动取消(库存紧张时订单请参见详情页时限)</div>
                    </div>
                    <div class="am-u-md-4 am-u-lg-4 am-padding-left-0 am-text-right">
                        <h2>应付金额<em class="am-text-danger">{{$order->pay_price}}</em>元</h2>
                        <div class="am-text-primary" style="cursor: pointer;" onclick="showOrderDetail()">订单详情<em class="am-icon am-icon-caret-down am-margin-left-xs"></em></div>
                    </div>
                    <div class="am-u-md-12 am-padding-right-0 am-collapse" id="order-detail">
                        <div class="am-text-sm  am-margin-bottom-xs">
                            <span>收货地址:{{$order->post_address}}</span>
                            <span style="margin-left: 10px;">收货人:{{$order->consignee}}&nbsp;&nbsp;{{$order->phone}}</span>
                        </div>
                        <div class="am-text-sm  am-margin-bottom-xs">
                            <span>商品信息:</span>
                            @foreach($order_goods as $goods)
                            <span style="margin-right: 10px;">{{$goods->goods_name}}({{$goods->goods_spec}})&nbsp;&nbsp;数量:{{$goods->number}}</span>
                             @endforeach
                        </div>
                    </div>
                </div>
                <div class="am-g am-bg-white am-margin-bottom-sm am-padding am-padding-left-0">
                    <div class="am-border-bottom">
                        <span class="pay-title am-btn-danger am-padding-top-xs am-padding-bottom-xs am-padding-left-sm am-padding-right-sm am-margin-bottom-sm">支付方式</span>
                    </div>
                    <div class="am-padding-left">
                        <form id="order-pay" action="{{url()->current()}}" method="post">
                            {{csrf_field()}}
                        <section data-am-widget="accordion" class="am-accordion am-accordion-basic">
                            {{--<dl class="am-accordion-item am-active">--}}
                                {{--<dt class="am-accordion-title">--}}
                                    {{--<label class="am-radio am-danger am-inline-block">--}}
                                        {{--<input type="radio" name="radio" value="" data-am-ucheck checked>--}}
                                        {{--<em class="am-text-lg"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/bank.png" />在线支付</em>--}}
                                    {{--</label>--}}
                                {{--</dt>--}}
                                {{--<dd class="am-accordion-bd am-collapse am-in">--}}
                                    {{--<div class="am-accordion-content">--}}
                                        {{--<ul class="paytype-list am-avg-md-3 am-avg-lg-5 am-padding">--}}
                                            {{--<li class="am-active">--}}
												{{--<span class="am-inline-block">--}}
													{{--<img src="{{config('mall.pc_assets')}}/detail/img/alipay.png" />--}}
													{{--<em style="background-image: url({{config('mall.pc_assets')}}/detail/img/checked.png);"></em>--}}
												{{--</span>--}}
                                            {{--</li>--}}
                                            {{--<li><img src="{{config('mall.pc_assets')}}/detail/img/bankpay.png" /></li>--}}
                                            {{--<li><img src="{{config('mall.pc_assets')}}/detail/img/idcard.png" /></li>--}}
                                        {{--</ul>--}}
                                    {{--</div>--}}
                                {{--</dd>--}}
                            {{--</dl>--}}
                            <dl class="am-accordion-item">
                                @if($zone == 1)
                                <dt class="am-accordion-title am-border-bottom">
                                    <label class="am-radio am-danger am-inline-block">
                                        <input type="radio" name="zhifu" value="101" data-am-ucheck>
                                        <em class="am-text-lg am-padding-right-sm"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/other.png"  />{{get_currency()['money1']}}</em><em class="am-text-xs am-link-muted">余额{{$wallet->money1}}</em>
                                    </label>
                                </dt>
                                @elseif($zone == 2)
                                <dt class="am-accordion-title am-border-bottom">
                                    <label class="am-radio am-danger am-inline-block">
                                        <input type="radio" name="zhifu" value="102" data-am-ucheck>
                                        <em class="am-text-lg am-padding-right-sm"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/other.png"  />{{get_currency()['money2']}}</em><em class="am-text-xs am-link-muted">余额{{$wallet->money2}}</em>
                                    </label>
                                </dt>
                                <dt class="am-accordion-title am-border-bottom">
                                    <label class="am-radio am-danger am-inline-block">
                                        <input type="radio" name="zhifu" value="103" data-am-ucheck>
                                        <em class="am-text-lg am-padding-right-sm"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/other.png"  />{{get_currency()['money3']}}</em><em class="am-text-xs am-link-muted">余额{{$wallet->money3}}</em>
                                    </label>
                                </dt>
                                @elseif($zone == 3)
                                <dt class="am-accordion-title am-border-bottom">
                                    <label class="am-radio am-danger am-inline-block">
                                        <input type="radio" name="zhifu" value="104" data-am-ucheck>
                                        <em class="am-text-lg am-padding-right-sm"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/other.png"  />{{get_currency()['money4']}}</em><em class="am-text-xs am-link-muted">余额{{$wallet->money4}}</em>
                                    </label>
                                </dt>
                                @elseif($zone == 4)
                                    <dt class="am-accordion-title am-border-bottom">
                                        <label class="am-radio am-danger am-inline-block">
                                            <input type="radio" name="zhifu" value="105" data-am-ucheck>
                                            <em class="am-text-lg am-padding-right-sm"><img class="am-margin-left-xs am-margin-right-sm" src="{{config('mall.pc_assets')}}/detail/img/other.png"  />{{get_currency()['money2']}}+现金</em><em class="am-text-xs am-link-muted">余额{{$wallet->money2}}</em>
                                        </label>
                                    </dt>
                                @endif
                                {{--<dd class="am-accordion-bd am-collapse ">--}}
                                    <div class="am-accordion-content">
                                        {{--<a href="#" class="am-btn am-border am-text-danger am-margin-top">添加新卡/网银支付</a>--}}
                                        <div class="am-margin-top-lg">
                                            <div class="am-text-sm am-link-muted am-margin-bottom-xs">请输入支付密码</div>
                                            <div class="">
                                                <div class="am-fl">
                                                    <table class="am-table am-table-bordered">
                                                        <tbody>
                                                        <tr>
                                                            <td><input class="am-form-field" type="password" name="pay_pwd"></td>
                                                        </tr>
                                                        </tbody>
                                                    </table>
                                                </div>
                                                {{--<div class="am-fl am-padding am-margin-top-xs"><a href="#" class="am-text-primary">忘记支付密码?</a></div>--}}
                                            </div>
                                            <div class="clear"></div>
                                            <div class="am-margin-top-lg"><input type="submit" class="am-btn am-btn-danger" value="立即支付" /></div>
                                        </div>
                                    </div>
                                </dd>

                            </dl>
                        </section>
                        </form>
                    </div>
                </div>
{{--                <div class="am-g am-bg-white am-padding am-margin-bottom">--}}
{{--                    <div class="">--}}
{{--                        <img class="am-inline-block am-padding-right-xs" src="{{config('mall.pc_assets')}}/detail/img/daifu.png" />--}}
{{--                        <span class="am-text-default am-padding-top-xs am-inline-block">找人代付</span>--}}
{{--                    </div>--}}
{{--                </div>--}}
            </div>
        </div>
    </section>
@endsection
@push('scripts')
    <script>
        function showOrderDetail() {
            $('#order-detail').toggle();
        }
    </script>
@endpush